<!DOCTYPE html>
<html lang="en">
<head>
    <meta charset="UTF-8">
    <meta name="viewport" content="width=device-width, initial-scale=1.0">
    <title>消息模板</title>
    <style>
        body {
            font-family: Arial, sans-serif;
        }
        .form-container {
            width: 300px;
            margin: 0 auto;
            padding: 20px;
            border: 1px solid #ccc;
            border-radius: 5px;
        }
        .form-container h2 {
            text-align: center;
        }
        .form-group {
            margin-bottom: 20px;
        }
        .form-group label {
            display: block;
            margin-bottom: 10px;
        }
        .form-group input {
            width: 93%;
            padding: 10px;
            border: 1px solid #ccc;
            border-radius: 5px;
        }
        .form-group button {
            width: 100%;
            padding: 10px;
            background-color: #4CAF50;
            color: white;
            border: none;
            border-radius: 5px;
            cursor: pointer;
        }
        .form-group button:hover {
            background-color: #45a049;
        }
    </style>
</head>
<body>
    <div class="form-container">
        <h2>消息模板</h2>
        <form>
            <div class="form-group">
                <label for="current-password">消息模板</label>
                <input type="text" id="template" name="template" required>
            </div>
            <div class="form-group">
                <button type="submit">提交</button>
            </div>
        </form>
    </div>
<script>
    // 获取表单元素
    const form = document.querySelector('form');

    // 添加事件监听器
    form.addEventListener('submit', function(event) {
        // 阻止表单的默认提交行为
        event.preventDefault();

        // 获取输入字段的值
        const template = document.querySelector('#template').value;
        console.log(template)
        // 创建请求体
        const body = {
            'template': template
        };

        // 发送 POST 请求
        fetch('/api/system_config', {
            method: 'POST',
            headers: {
                'Content-Type': 'application/json'
            },
            body: JSON.stringify(body)
        })
        .then(response => response.json())
        .then(data => {
            console.log(data);
            if (data.code === 200) {
                alert('配置成功');
            } else {
                alert('配置失败');
            }
        })
        .catch(error => console.error('Error:', error));
    });
</script>
</body>
</html>